import style from './App.module.css';
import { Redirect, Route } from "react-router-dom";
import { routes } from '@/router';
import WithLazy from './utils/withLazy';
import { SpinLoading } from "antd-mobile";
import store from "@/store";

import React, { PureComponent } from 'react'

class App extends PureComponent {

  state = {
    isLoading1: store.getState().isLoading1,
  };

  componentDidMount() {
    store.subscribe(() => {
      this.setState({
        isLoading1: store.getState().isLoading1,
      });
    });
  }

  render() {
    return (
      <div className="App">
          <Redirect exact={true} from="/" to="/Home"></Redirect>
          {
            routes.map(item => <Route key={item.path} path={item.path} component={WithLazy(() => import(`@/views/${item.component}`))}></Route>)
          }
          
        <div
          className={style.loading}
          style={{ display: this.state.isLoading1 ? "block" : "none" }}
        >
          <SpinLoading color="primary" />
        </div>
      </div>
    )
  }
}

// const mapStateToProps = state => ({ isLoading1: state.isLoading1 })

// export default connect(mapStateToProps)(App);
export default App;
